<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-3.3.1.min.js"></script>
<title>Insert title here</title>
</head>
<body>
<h2 align="center">菜单添加</h2>
	<div align="center">
		<table>
			<tr>
				<td align="right" >请选择菜单级别：</td>
				<td><select id="level" onchange="queryUpMenu()">
					<option value="0">一级</option>
					<option value="3">二级</option>
				</select></td>
			</tr>
		</table>
	</div>
	<div align="center" style="margin-top: 30px">
		<h4>请按要求填写菜单信息</h4>
		<form name = "f">
			<table>
				<tr>
					<td align="right">菜单名称：</td>
					<td><input type="text" name="menuName"></td>
				</tr>
				<tr>
					<td align="right">菜单描述：</td>
					<td><input type="text" name="menuDescribe"></td>
				</tr>
				<tr>
					<td align="right">菜单状态：</td>
					<td><input type="radio" checked="checked" name="menuState" value="1" >可用<input type="radio" name="menuState" value="2">不可用</td>
				</tr>
				<tr>
					<td align="right">菜单路径：</td>
					<td><input type="text" name="menuUrl"></td>
				</tr>
				<tr>
					<td align="right" >上一级菜单：</td>
					<td><select name="menuLevel" id="showUpMenu" >
					</select></td>
				</tr>
				<tr>
					<td colspan="2" align="center"><input type="button" value="添加" onclick="doIns()"></td>
				</tr>
			</table>
		</form>
	</div>
</body>
<script type="text/javascript">
	function queryUpMenu(){
		var level = $("#level").val();
		$.ajax({
			type:"post",//设置提交方式
			url:"${pageContext.request.contextPath}/servlet/MenuUpServlet",
			async:true,//表示进行异步执行
			dataType:"json",//数据的返回类型
			data:{level:level},
			success:function(data){//data就是成功之后 Servlet返回的结果
				var se = $("#showUpMenu");
				se.empty();
				if(level == 0){
					se.append("<option value='0'>你创建的为一级菜单,没有上一级</option>"); 
				}else{
					for(var i = 0;i<data.length;i++){
						se.append("<option value='"+data[i].menuName+"'>"+data[i].menuName+"</option>"); 
					}
				}
			},
			error:function(err){
				alert("操作失败");
			}
		});
	}
	function doIns(){
		var menuName = f.menuName.value;
		var menuDescribe = f.menuDescribe.value;
		var menuState = f.menuState.value;
		var menuUrl = f.menuUrl.value;
		var menuLevel = f.menuLevel.value;
		if(confirm("确认添加？")){
			$.ajax({
				type:"post",//设置提交方式
				url:"${pageContext.request.contextPath}/servlet/MenuInsServlet",
				async:true,//表示进行异步执行
				dataType:"json",//数据的返回类型
				data:{menuName:menuName , menuDescribe:menuDescribe , menuState:menuState , menuUrl:menuUrl , menuLevel:menuLevel},
				success:function(data){//data就是成功之后 Servlet返回的结果
					if(data[0].result){
						alert("添加成功！");
						query(0);
					}else{
						alert("添加失败");
					}
				},
				error:function(err){
					alert("操作失败");
				}
			});
		}
	}
</script>
</html>